<template>
  <div>
    <div class="box">
      <van-cell>
        <template #title>
          <van-field v-model="name" label="名称" placeholder="分类名称" />
          <van-field v-model="explain" label="描述" placeholder="分类描述" />
        </template>
      </van-cell>
      <div style="margin-top: 10px">
        <van-button type="primary" block @click="add()">新增</van-button>
      </div>
    </div>
  </div>
</template>

<script>
import { SupplierAddGoodsType } from "../api/good";
import { reactive, toRefs } from "vue";
import { showConfirmDialog, showSuccessToast, showToast } from "vant";
import { useRouter } from "vue-router";
export default {
  setup() {
    const router = useRouter();
    const data = reactive({
      name: "", //类别名称
      explain: "", //类别描述
    });
    const event = {
      add() {
        if (data.name === "") {
          showToast("请输入类别名称");
        } else {
          showConfirmDialog({
            message: "确认新增吗",
          })
            .then(() => {
              SupplierAddGoodsType({
                name: data.name,
                explain: data.explain,
              }).then((res) => {
                if (res.result === 0) {
                  showSuccessToast("新增成功");
                  setTimeout(() => {
                    showConfirmDialog({
                      message: "确认继续新增吗",
                    })
                      .then(() => {
                        router.push({ path: "/shangpin/addType" });
                      })
                      .catch(() => {
                        router.push({ path: "/shangpin/updateType" });
                      });
                  }, 1000);
                }
              });
            })
            .catch(() => {});
        }
      },
    };

    return {
      ...toRefs(data),
      ...event,
    };
  },
};
</script>

<style scoped>
.box {
  margin: 5px;
  padding: 5px;
  width: 95%;
}
</style>